@media screen and (min-width: 750px) {
    html {
        font-size: 75px !important;
    }
}

@media screen and (max-width: 320px) {
    html {
        font-size: 32px !important;
    }
}

body {
    background-color: #f9f9f9;
    margin: auto;
}

header {
    width: 10rem;
    height: 1.28rem;
    background-image: linear-gradient(180deg, #f24c59 0%, #f28c4c 100%);

    ul {
        width: 5.8rem;
        display: flex;
        justify-content: space-between;

        li:nth-child(1) {

            margin-left: .4267rem;

            img {
                width: .2855rem;
                height: .5177rem;
                margin-top: .2931rem;
            }

        }

        li:nth-child(2) {
            margin-top: .2667rem;

            display: flex;
            justify-content: center;
            font-weight: 600;

            >span {
                color: #ffffff;
                font-size: .5333rem;
                line-height: .5067rem;
            }
        }
    }


}

.top {
    width: 9.1733rem;
    margin: auto;
    position: relative;
    background-color: #ffffff;
    box-shadow: 0 0 .16rem rgba(123, 123, 123, 0.16);

    i {
        margin-left: .4rem;
        display: flex;
        align-items: center;

        img {
            width: .32rem;
            height: .4141rem;
            margin-top: .04rem;
        }

        span {
            margin-left: .1333rem;
            color: #494955;
            font-size: .3733rem;
        }
    }

    >p {
        margin-top: .16rem;
        font-weight: 600;
        margin-left: .4rem;
        color: #202020;
        font-size: .4267rem;
    }

    .p2 {
        margin-top: .5333rem;
        color: #494955;
        font-size: .3733rem;
    }

    img {
        width: 9.1733rem;

        margin-top: .2667rem;
        margin-bottom: .0267rem;
    }

    #p3 {
        position: absolute;
        width: .1869rem;
        height: .3205rem;
        border-color: #cbcbcb;
        right: .2667rem;
        top: 1.0667rem;
    }
}

.Staging {

    width: 9.1733rem;
    height: 7.2267rem;
    background-color: #ffffff;
    border-radius: .2667rem;
    box-shadow: 0 0 .16rem rgba(123, 123, 123, 0.16);
    margin: auto;
    margin-top: .2667rem;

    ul {
        display: flex;


        li {
            margin-top: .5333rem;

            img {
                margin-left: .4rem;
                width: 2.6667rem;
                height: 2.6667rem;
                background-color: #f4f4f4;
            }
        }

        li:nth-child(2) {
            p:nth-child(1) {
                font-weight: 600;
                color: #202020;
                font-size: .4267rem;

            }

            p:nth-child(2) {
                margin-top: .1067rem;
                font-weight: 600;
                color: #fd444c;
                font-size: .32rem;
                line-height: .4533rem;
            }

            img {
                margin-top: .4267rem;
                width: 1.8933rem;
                height: .5333rem;
                margin-left: 0px;
            }

        }


    }

    .Staging_1 {
        margin-top: .4rem;
        display: flex;
        justify-content: space-between;

        span:nth-child(1) {
            margin-left: .4rem;
            color: #202020;
            font-size: .3733rem;
            font-weight: 600;
        }

        span:nth-child(2) {
            color: #494955;
            font-size: .3733rem;
            margin-right: .5333rem;
        }
    }

    .Staging_2 {
        width: 8.2933rem;
        height: 1.0933rem;
        background-color: #f4f4f4;
        border-radius: .24rem;
        margin: auto;

        display: flex;
        margin-top: .5333rem;
        // justify-content: center;

        span {
            margin-top: .32rem;
            margin-left: .4533rem;
            width: 4.8533rem;
            height: .5333rem;
            font-family: PingFang SC;
            color: #b0b8c2;
            font-size: .3733rem;




        }
    }

    .Staging_3 {
        display: flex;
        margin-top: .4rem;
        width: 4.7733rem;

        img {
            width: .3965rem;
            height: .4628rem;
            margin-left: .4035rem;
            margin-top: .0133rem;

        }

        span {
            font-weight: 600;
            color: #202020;
            font-size: .3733rem;
            margin-left: .24rem;
            white-space: nowrap;
        }


    }

    margin-bottom: .2667rem;
}

.boob {

    width: 9.1733rem;
    height: 3.8667rem;
    background-color: #ffffff;
    border-radius: .2667rem;
    box-shadow: 0 0 .16rem rgba(123, 123, 123, 0.16);
    margin: auto;
    overflow: hidden;

    ul {
        margin-top: .5333rem;

        li {
            margin-left: .4rem;
            display: flex;
            margin-right: .9333rem;
            justify-content: space-between;
            margin-top: .4267rem;

            span:nth-child(1) {

                font-weight: 600;
                color: #202020;
                font-size: .4267rem;
            }

            span:nth-child(2) {
                font-weight: 600;
                color: #202020;
                font-size: .4267rem;
            }
        }

        li:nth-child(3) {
            i {
                display: flex;

                span {
                    color: #6a6c6b;
                    font-size: .4267rem;
                    font-weight: normal;
                }

                img {
                    margin-left: .2667rem;
                }
            }
        }
    }
}

.boobt {
    position: fixed;
    bottom: 0;
    display: flex;
    justify-content: right;
    width: 10rem;
    height: 1.6rem;
    background-color: #ffffff;
    // background-color: pink;
    margin-top: 2rem;
    box-shadow: 0 .0267rem 0s #e5e5e5 inset;

    span:nth-child(1) {
        font-weight: 600;
        color: #f23a3a;
        font-size: .48rem;
        line-height: .4533rem;
        margin-right: .2667rem;
        margin-top: .5333rem;
        color: #f23a3a;

    }

    span:nth-child(2) {
        width: 3.92rem;
        height: 1.3333rem;
        background-color: #ff6200;
        border-radius: 1.0667rem;
        margin-top: .1333rem;
        margin-right: .2667rem;
        text-align: center;
        line-height: 1.3333rem;
        color: #ffffff;
        font-size: .4267rem;
        font-weight: 600;
    }
}